<template>
  <el-config-provider :locale="locale">
    <router-view :multiLanguages="multiLanguages"></router-view>
  </el-config-provider>
</template>

<script setup lang="ts">
import { ref, Ref, provide } from "vue";

import zhCn from "element-plus/es/locale/lang/zh-cn";
import en from "element-plus/es/locale/lang/en";
import pt from "element-plus/es/locale/lang/pt";
const languagemapping = { zh_CN: zhCn, en_US: en, pt_BR: pt };
const locale: Ref<any> = ref(
  languagemapping[(localStorage.getItem("language") as "zh_CN" | "en_US" | "pt_BR") || "zh_CN"]
);
const changeEleLang = (language: "zh_CN" | "en_US" | "pt_BR") => {
  locale.value = languagemapping[language];
};
provide("changeEleLang", changeEleLang);

import { useI18n } from "vue-i18n";
const { t: multiLanguages } = useI18n();
</script>
